<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
<base th:href="@{/}">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>左侧导航</title>
<th:block th:include ="commHeaderInclude::commHead">
</th:block>
    <link rel="stylesheet" th:href="@{/css/nav.css}">
<style>
    body, html{
      overflow-y: auto;
      overflow-x: hidden;
      background-color: #fff;
    }
</style>
</head>
<body>
<nav class="sidebar" id="sidebar">
    <ul class="nav" id="nav">

        <li class="nav-item home">
            <i class="mdi mdi-home-variant menu-icon"></i>
            <a target="_parent" class="nav-link menu-title" href="/orfp/home.do">
                返回首页
                
            </a>
            <i class="mdi mdi-chevron-double-left menu-icon switchDiv" id="switchDiv"></i>
        </li>
        <li class="nav-item title">
            <h2><a target="mainFrame" th:text="${session.mcpName}" class="nav-link" th:href="@{/login/dashboard}">医保贷业务系统</a></h2>
        </li>
<!--        ${navTreeList}-->
        <li class="nav-item" th:each="li,item:${navTreeList}" th:if="${li.rightType eq '2'}">
            <i class="menu-icon"><span class="menu-num" th:text="${item.index+1}"></span></i>
            <a target="mainFrame" class="nav-link menu-title" th:href="${li.url}" data-bs-toggle="collapse" aria-expanded="false" aria-controls="ui-form">
                [[${li.rightName}]]
                <i class="mdi mdi-menu-down menu-icon"></i>
            </a>
            <ul th:if="${#lists.size(li.childList)>0}" class="sub-menu">
                <li th:each="lii,item:${li.childList}" class="nav-item"  th:if="${lii.rightType eq '2'}">

                    <a th:href="${lii.url}" target="mainFrame" class="nav-link"  href="">
                        [[${lii.rightName}]]
                        <i class="mdi mdi-menu-right menu-icon"></i>
                    </a>
                    <ul th:if="${#lists.size(lii.childList)>0}" class="sub-menu">
                        <li th:each="liii,item:${lii.childList}" class="nav-item ml-0"   th:if="${liii.rightType eq '2'}">
                            <a target="mainFrame" class="nav-link pl-0" th:href="${liii.url}">[[${liii.rightName}]]</a>
                        </li>
                    </ul>
                </li>
            </ul>
        </li>


        <!--   以上是动态的效果，一下是静态的效果     -->
        <!--<li class="nav-item">
            <i class="menu-icon">1</i>
            <a class="nav-link menu-title" data-bs-toggle="collapse" href="#ui-form" aria-expanded="false" aria-controls="ui-form">
                融资服务
                <i class="mdi mdi-menu-down menu-icon"></i>
            </a>
            <ul class="sub-menu">
                <li class="nav-item">
                    <a target="mainFrame" class="nav-link" href="../base/finance/businessRules.html">
                        我要融资
                        <i class="mdi mdi-menu-right menu-icon"></i>
                    </a>
                    <ul class="sub-menu">
                        <li class="nav-item">
                            <a target="mainFrame" clas="nav-link" href="#">第三阶级一</a>
                        </li>
                        <li class="nav-item">
                            <a target="mainFrame" clas="nav-link" href="#">第三阶级二</a>
                        </li>
                        <li class="nav-item">
                            <a target="mainFrame" clas="nav-link" href="#">第三阶级三</a>
                        </li>
                        <li class="nav-item">
                            <a target="mainFrame" clas="nav-link" href="#">第三阶级四</a>
                        </li>
                    </ul>
                </li>
                <li class="nav-item">
                    <a target="mainFrame" class="nav-link" href="../pages/forms/updateAllForm.html">
                        申请融资记录
                        <i class="mdi mdi-menu-right menu-icon"></i>
                    </a>
                </li>
                <li class="nav-item">
                    <a target="mainFrame" class="nav-link" href="../pages/forms/updateAllForm.html">
                        放款信息
                        <i class="mdi mdi-menu-right menu-icon"></i>
                    </a>
                </li>
            </ul>
        </li>
        <li class="nav-item">
            <i class="menu-icon">2</i>
            <a class="nav-link menu-title" data-bs-toggle="collapse" href="#ui-list" aria-expanded="false" aria-controls="ui-basic">
                我的园地
                <i class="mdi mdi-menu-down menu-icon"></i>
            </a>
            <ul class="sub-menu">
                <li class="nav-item">
                    <a target="mainFrame" class="nav-link" href="../pages/tables/index.html">
                        企业信息
                        <i class="mdi mdi-menu-right menu-icon"></i>
                    </a>
                </li>
                <li class="nav-item">
                    <a target="mainFrame" class="nav-link" href="../pages/tables/fixedList.html">
                        下载专区
                        <i class="mdi mdi-menu-right menu-icon"></i>
                    </a>
                </li>
            </ul>
        </li>-->
    </ul>
</nav>
</body>
<script type="text/javascript">
    //seajs.use("/mcp/include/js/nav");

    var LayoutController=function(selector){
        this.element=$(selector).get(0)
        this.element=top.document.body
        this.init();
    };
    LayoutController.prototype.init=function(){
        var self=this;
        this.asideSwitch=$("#switchDiv").get(0)
        $(this.asideSwitch).bind("click",function(event){self.asideSwitchClickHandle(event)});
        if($(top.document).find(".switchDiv")){
            $(top.document).find(".switchDiv").bind("click",function(event){self.asideSwitchClickHandle(event)});
        }


    }
    LayoutController.prototype.type="leftAside"
    LayoutController.prototype.aisdeStatus="open"
    LayoutController.prototype.asideSwitchClickHandle=function(){
        this.switchAside();
    }
    LayoutController.prototype.switchAside=function(){
        if(this.aisdeStatus=="open"){
            this.aisdeStatus="close"
        }else{
            this.aisdeStatus="open"
            $("#asideSwitch").attr("title","收起左侧菜单");
        }
        this.update();
    }
    LayoutController.prototype.update=function(){
        $(this.element).removeClass("asideClose")
        if(this.aisdeStatus=="close"){
            $(this.element).addClass("asideClose")
            $("#asideSwitch").attr("title","展开左侧菜单");
        }
    }





    var Nav=function(options){
        this.init(options);
    }
    Nav.prototype.init=function(options){
        var self=this;
        this.options=$.extend(self.getDefaultOptions(),options);
        this.element=$("#nav").get(0);
        this.aList=$(this.element).find("a");
        for(var i=0;i<this.aList.length;i++){
            var aele=this.aList.eq(i);
            if(!!aele.next("ul")&&aele.next("ul").hasClass("open")){
                aele.data("click",true);
            }

        }
        this.aList.bind("click",function(event){
            return self.clickHandle(event);
        })
        $("i").not("#switchDiv").bind("click",function(event){
            event.stopPropagation();
            $(this).parent("a").click();
            return false;
        })
        var layoutController=new LayoutController();
    }
    Nav.prototype.getDefaultOptions=function(){
        var options={
            onlyOneOpen:false,//是否只有一条树开关
        }
        return options;
    }
    Nav.prototype.changeActive=function(ele){
        $(this.element).find("a.active").removeClass("active")
        ele.addClass("active")
    }
    Nav.prototype.clickHandle=function(event){

        var self=this;
        var ele=$(event.target);
        if(self.isDeeppestEle(ele)){
            self.changeActive(ele);
            return true;
        }
        if(ele.data("click")==true){
            self.switchAction(ele,false,self.options.onlyOneOpen);
            return false;
        }
        if(self.options.onlyOneOpen)self.closeAll();
        ele.data("click",true);
        if(ele.next("ul").find("li").length>0){
            self.switchAction(ele,true,self.options.onlyOneOpen);
            return false;
        }
        return false;
    }
    Nav.prototype.isDeeppestEle=function(ele){
        var a=!ele.next("ul").find("li").length>0;
        console.log(a);
        return a;
    }
    Nav.prototype.closeAll=function(){
        var self=this;
        for(var i=0;i<self.aList.length;i++){
            if(self.aList.eq(i).data("click")==true){
                self.switchAction(self.aList.eq(i),false)
            }
        }
    }
    Nav.prototype.switchAction=function(ele,bol,deep){
        var self=this;
        if(bol){
            ele.data("click",true);
            ele.next("ul").addClass("open");
            if(ele.parent("li").parent("ul").hasClass("sub-menu")&&deep){
                self.switchAction(ele.parent("li").parent("ul").prev("a"),true,true)
            }
        }else{
            ele.data("click",false);
            ele.next("ul").removeClass("open");
            if(deep&&ele.next("ul")){
                try {
                    for (var i = 0; i < ele.next("ul").children("li").length; i++) {
                        self.switchAction(ele.next("ul").children("li").children("a").eq(0), false, true)
                    }
                } catch (e) {
                    console.log(e);
                }
            }
        }
    }
    /*Nav.prototype.recursionTree=function(obj){
        return this.recursionTree(newObj,fun())
    }*/
    var nav=new Nav();
</script>
</html>
